<template>
  <div>
    <!-- 根据司机获得主运单管理 2018/3/7 11:44 zhangQ -->
    <Tabs value="statu" @on-click="handleTabStatu">
      <TabPane label="配送中" name="5">
        <Table border :columns="columns1" :data="tableData.rows"></Table>
      </TabPane>
      <TabPane label="已完成" name="6">
        <Table border :columns="columns1" :data="tableData.rows"></Table>
      </TabPane>
    </Tabs>
    <Page style="float:right;margin-top:5px" :total="999" show-elevator show-sizer @on-change="CurrentChange"
          @on-page-size-change="sizeChange"></Page>
    <Modal v-model="modal2" title="派遣司机" @on-ok="subDriver">
      <Table border ref="selection" :columns="columns4" :data="driverList" @on-select="selection"></Table>
    </Modal>

    <Modal
      v-model="modal1"
      title="派遣司机"
      width='80%'
    >
      <Table border ref="selection" :columns="columns5" :data="SubOrderList"></Table>
    </Modal>

    <Modal v-model="uploadPoundModel" title="添加需求计划" @on-ok="handleSubmit('uploadPoundForm')"
           @on-cancel="clearUploadPound">
      <Form :model="uploadPoundForm" :label-width="150" :rules="uploadPoundFormRules" ref="uploadPoundForm">
        <Form-item label="毛重" prop="grossWeight">
          <Input v-model="uploadPoundForm.grossWeight" placeholder="请填写毛重"></Input>
        </Form-item>

        <Form-item label="毛重时间">
          <DatePicker v-model="uploadPoundForm.grossWeightTime" type="datetime" placeholder="请选择毛重时间"
                      style="width: 200px"></DatePicker>
        </Form-item>

        <Form-item label="皮重" prop="tareWeight">
          <Input v-model="uploadPoundForm.tareWeight" placeholder="请填写皮重"></Input>
        </Form-item>

        <Form-item label="皮重时间">
          <DatePicker v-model="uploadPoundForm.tareWeightTime" type="datetime" placeholder="请选择毛重时间"
                      style="width: 200px"></DatePicker>
        </Form-item>

        <Form-item label="净重" prop="netWeight">
          <Input v-model="uploadPoundForm.netWeight" placeholder="请填写净重"></Input>
        </Form-item>

        <Form-item label="磅单编号" prop="poundNo">
          <Input v-model="uploadPoundForm.poundNo" placeholder="请填写磅单编号"></Input>
        </Form-item>
      </Form>
    </Modal>
  </div>
</template>
<script>
  import { getMainOrderListByTruckId, getdriverlist, dispatchDriver, getSubOrderListByMainOrderNo, uploadPound } from '@api/backEnd/fleetControl'
  import moment from 'moment'

  export default {
    name: 'mainOrderTruckid',
    data () {
      return {
        uploadPoundModel: false,
        uploadPoundForm: {
          subOrderNo: '',
          containerNo: '',
          truckNo: '',
          grossWeight: 0,
          grossWeightTime: '',
          tareWeight: 0,
          tareWeightTime: '',
          netWeight: 0,
          poundNo: ''
        },
        uploadPoundFormRules: {
          grossWeight: [
            { required: true, message: '毛重必填', trigger: 'blur' }
          ],
          grossWeightTime: [
            { required: true, message: '时间必填', trigger: 'blur' }
          ],
          tareWeight: [
            { required: true, message: '皮重必填', trigger: 'blur' }
          ],
          tareWeightTime: [
            { required: true, message: '时间必填', trigger: 'blur' }
          ],
          netWeight: [
            { required: true, message: '净重必填', trigger: 'blur' }
          ],
          poundNo: [
            { required: true, message: '磅单编号必填', trigger: 'blur' }
          ]
        },
        modal1: false,
        modal2: false,
        statu: 5,
        tableData: {
          pagination: {
            total: 0,
            pageNo: 1,
            pageSize: 10,
            parentId: 0
          },
          rows: []
        },
        mainOrderNo: '',
        driverArr: [],
        SubOrderList: [],
        SubOrderNo: '',
        columns5: [
          {
            title: '子运单号',
            key: 'orderNO'
          },
          {
            title: '箱号',
            key: 'container_no'
          },
          {
            title: '货票号',
            key: 'waybill_no'
          },
          {
            title: '司机姓名',
            key: 'driver_name'
          },
          {
            title: '车牌号',
            key: 'truck_plate'
          },
          {
            title: '车队名称',
            key: 'fleet_name'
          },
          {
            title: '司机拉运时间',
            key: 'bind_time'
          },
          {
            title: '矿发吨数',
            key: 'send_weight'
          },
          {
            title: '电厂净重',
            key: 'net_weight'
          },
          {
            title: '磅单编号',
            key: 'pound_no'
          },
          {
            title: '上传磅单时间',
            key: 'upload_pound_time'
          },
          {
            title: '送货地址',
            key: 'shipping_address'
          },
          {
            title: '上传磅单',
            key: 'action',
            align: 'center',
            render: (h, params) => {
              let truckPlate = params.row.truck_plate
              let poundNo = params.row.pound_no
              if (truckPlate !== '----' && truckPlate !== '' && !poundNo) {
                return h('Button', {
                  props: {
                    type: 'primary',
                    size: 'small'
                  },
                  on: {
                    click: (e) => {
                      e.preventDefault()
                      this.uploadPoundModel = true
                      this.uploadPoundForm.subOrderNo = params.row.orderNO
                      this.uploadPoundForm.containerNo = params.row.container_no
                      this.uploadPoundForm.truckNo = params.row.truck_plate
                    }
                  }
                }, '上传磅单')
              }
            }
          }
        ],
        columns4: [
          {
            type: 'selection',
            width: 60,
            align: 'center'
          },
          {
            title: '用户名',
            key: 'login_name',
            render: (h, params) => {
              return h('div', [
                h('Icon', {
                  props: {
                    type: 'person'
                  }
                }),
                h('strong', params.row.login_name)
              ])
            }
          }
        ],
        driverList: [],
        columns1: [
          {
            title: '联运单号',
            key: 'mainOrderNo'
          },
          {
            title: '送货地址',
            key: 'address'
          },
          {
            title: '箱子总数',
            key: 'allContaninersCount'
          },
          {
            title: '已绑定箱数',
            key: 'bindContaninersCount'
          },
          {
            title: '收货人',
            key: 'receiver'
          },
          {
            title: '发货人',
            key: 'shipper'
          },
          {
            title: '对应时间',
            key: 'para_position_time'
          },
          {
            title: '对位股道',
            key: 'para_position_track'
          },
          {
            title: '操作',
            key: 'action',
            align: 'center',
            render: (h, params) => {
              return h('div', [
                h('Button', {
                  props: {
                    type: 'primary',
                    size: 'small'
                  },
                  style: {
                    marginRight: '8px'
                  },
                  on: {
                    click: (value, row) => {
                      // let containerNo = params.row.container_no
                      // this.ContainerPosition(containerNo);
                      this.modal2 = true
                      this.mainOrderNo = params.row.mainOrderNo
                      getdriverlist({
                        page: 1,
                        pageSize: 500
                      }).then(res => {
                        console.log(res.data)
                        if (+res.data.isSuccess === 1) {
                          this.driverList = res.data.data.list
                        } else {
                          console.log(res.data.res)
                        }
                      })
                    }
                  }
                }, '派遣司机'),
                h('Button', {
                  props: {
                    type: 'error',
                    size: 'small'
                  },
                  on: {
                    click: () => {
                      // let id = params.row.container_no
                      this.SubOrderNo = params.row.mainOrderNo
                      this.modal1 = true
                      getSubOrderListByMainOrderNo({
                        mainOrderNo: this.SubOrderNo
                      }).then(res => {
                        console.log(res.data)
                        this.SubOrderList = res.data.data
                      })
                    }
                  }
                }, '查看子运单')
              ])
            }
          }
        ]
      }
    },
    computed: {},
    methods: {
      handleSubmit (name) {
        this.$refs[name].validate((valid) => {
          if (valid) {
            let subOrderNo = this.uploadPoundForm.subOrderNo
            let containerNo = this.uploadPoundForm.containerNo
            let truckNo = this.uploadPoundForm.truckNo
            let grossWeight = this.uploadPoundForm.grossWeight
            let grossWeightTime = moment(this.uploadPoundForm.grossWeightTime).format
            let tareWeight = this.uploadPoundForm.tareWeight
            let tareWeightTime = moment(this.uploadPoundForm.tareWeightTime)
            let netWeight = this.uploadPoundForm.netWeight
            let poundNo = this.uploadPoundForm.poundNo
            if (grossWeightTime && tareWeightTime && (grossWeightTime > tareWeightTime)) {
              this.$Message.error('时间有误！')
              return false
            }
            let param = {
              subOrderNo,
              containerNo,
              truckNo,
              grossWeight,
              grossWeightTime,
              tareWeight,
              tareWeightTime,
              netWeight,
              poundNo
            }
            uploadPound(param).then(res => {
              if (+res.data.isSuccess === 1) {
                this.$Message.success('磅单上传成功！')
                this.clearUploadPound()
                getSubOrderListByMainOrderNo({
                  mainOrderNo: this.SubOrderNo
                }).then(res => {
                  this.SubOrderList = res.data.data
                })
              } else {
                this.$Message.error('发布失败请重试！')
                this.uploadPoundModel = true
              }
            })
          }
        })
      },
      clearUploadPound () {
        this.uploadPoundModel = false
        this.uploadPoundForm.subOrderNo = ''
        this.uploadPoundForm.containerNo = ''
        this.uploadPoundForm.truckNo = ''
        this.uploadPoundForm.grossWeight = 0
        this.uploadPoundForm.grossWeightTime = ''
        this.uploadPoundForm.tareWeight = 0
        this.uploadPoundForm.tareWeightTime = ''
        this.uploadPoundForm.netWeight = 0
        this.uploadPoundForm.poundNo = ''
      },
      subDriver (status) {
        this.driverArr = JSON.stringify(this.driverArr)
        dispatchDriver({
          loginNames: this.driverArr,
          mainOrderNo: this.mainOrderNo
        }).then(res => {
          console.log(res.data)
          if (+res.data.isSuccess === 1) {
            this.$Message.info('派遣成功')
          }
        })
      },
      selection (val) {
        if (val) {
          this.driverArr = []
          for (let item in val) {
            this.driverArr.push(val[item].login_name)
          }
        }
      },
      handleTabStatu (name) {
        this.statu = name
        this.loadData()
      },
      CurrentChange (val) {
        this.tableData.pagination.pageNo = val
        this.loadData()
      },
      sizeChange (val) {
        this.tableData.pagination.pageSize = val
        this.loadData()
      },
      loadData () {
        console.log(this.statu)
        getMainOrderListByTruckId({
          status: this.statu,
          page: this.tableData.pagination.pageNo,
          pageSize: this.tableData.pagination.pageSize
        }).then(res => {
          console.log(res.data)
          if (+res.data.isSuccess === 1) {
            this.tableData.rows = res.data.data
            this.tableData.pagination.total = res.total
          } else {
            console.log(res.data)
            this.tableData.rows = []
          }
        })
      }
    },
    created () {
      this.loadData()
    },
    components: {}
  }
</script>
<style scoped>

</style>
